import { Message } from 'element-ui';
import { getParaListByCodes, getSysParaListByCodes } from '@/service/core/dictionary.js';
import { mapState } from 'vuex';

export const vdrag = {
    directives: {
        'dialog-drag': { // 弹窗拖拽
            bind(el, binding, vnode, oldVnode) {
                const dialogHeaderEl = el.querySelector('.el-dialog__header');
                const dragDom = el.querySelector('.el-dialog');
                dialogHeaderEl.style.cursor = 'move';

                // 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
                const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null);

                dialogHeaderEl.onmousedown = (e) => {
                    // 鼠标按下，计算当前元素距离可视区的距离
                    const disX = e.clientX - dialogHeaderEl.offsetLeft;
                    const disY = e.clientY - dialogHeaderEl.offsetTop;

                    // 获取到的值带px 正则匹配替换
                    let styL, styT;

                    // 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px
                    if(sty.left.includes('%')) {
                        styL = +document.body.clientWidth * (+sty.left.replace(/\%/g, '') / 100);
                        styT = +document.body.clientHeight * (+sty.top.replace(/\%/g, '') / 100);
                    }else {
                        styL = +sty.left.replace(/\px/g, '');
                        styT = +sty.top.replace(/\px/g, '');
                    };

                    document.onmousemove = function (e) {
                        // 通过事件委托，计算移动的距离
                        const l = e.clientX - disX;
                        const t = e.clientY - disY;
                        // 移动当前元素
                        dragDom.style.left = `${l + styL}px`;
                        dragDom.style.top = `${t + styT}px`;

                        //将此时的位置传出去
                        //binding.value({x:e.pageX,y:e.pageY})
                    };

                    document.onmouseup = function (e) {
                        document.onmousemove = null;
                        document.onmouseup = null;
                    };
                }
            }
        },
        'height': {
            inserted(el, binding, vnode, oldVnode) {
                setTimeout(() => {
                    const height = el.offsetTop || el.offsetParent.offsetTop;
                    if(height > 0) {
                        el.style.height = window.innerHeight - 145 - height + 'px';
                        el.style.overflow = 'auto';
                    }
                }, 100)
            }
        }
    }
}

export const delayClick = {
    directives: {
        'delayClick': {
            inserted(el, binding) {
                let func = binding.value['func'];
                let time = binding.value['time'] || 1000;
                let args = [];
                for (const key in binding.value) {
                    if (binding.value.hasOwnProperty(key)) {
                        if (key === 'func' || key === 'time') continue;
                        args.push(binding.value[key])
                    }
                }
                el.addEventListener('click', (e) => {
                    if (!el.disabled) {
                        el.disabled = true;
                        func(...args);
                        setTimeout(() => {
                            el.disabled = false;
                        }, time)
                    } else {
                        Message({
                            message: '操作太频繁，请稍后再试！',
                            type: 'warning'
                        });
                    }
                })
            }
        }
    }
}

// 列设置
export const columnSet = {
    data() {
        return {
            flag: true,
            checked: false,
            staffTableSel: [],
            staffTableSel2: [],
            selTableVisible: false,
            tableKey: new Date().getTime(),
        }
    },
    created(){
        this.selAllInit();
    },
    methods: {
        selAllInit() { // 页面第一次加载 初始化列设置
            this.tableData.headerData.forEach((item,index)=>{
                if(item.isShow){
                    this.staffTableSel.push(item.prop);
                    this.staffTableSel2.push(item.prop);
                }
            })
            let hideColumns =  this.tableData.headerData.filter( v => v.isShow == false);
            if(hideColumns.length > 0) {
                this.checked = false;
            }else {
                this.checked = true;
            }
        },
        selAll(){ // 全选
            if(this.checked){
                this.staffTableSel.splice(0, this.staffTableSel.length);
                this.tableData.headerData.forEach((item,index)=>{
                    this.staffTableSel.push(item.prop);
                })
            }else if(!this.checked){
                this.staffTableSel = this.tableData.headerData.filter(v => v.disabled == true).map(v => v.prop);
            }
        },
        selColumnChange(list) { // 列选择 事件
            if(list.length < this.tableData.headerData.length) this.checked = false;
            if(list.length == this.tableData.headerData.length) this.checked = true;
        },
        setColumn(){ // 列设置 按钮点击
            if(this.flag){
                this.selTableVisible=true;
                this.flag=false;
            }else{
                this.selTableVisible=false;
                this.flag=true;
            }
        },
        selTableBtn(){ // 列设置 确定
            this.selTableVisible=false;
            this.flag=true;
            // this.staffTableSel2 = [...this.staffTableSel];
            this.staffTableSel2 = this.tableData.headerData.filter(item => {
                if(this.staffTableSel.findIndex(v => v == item.prop) > -1) {
                    return true
                }
            }).map(v => v.prop)
            this.tableKey = new Date().getTime();
        },
        showColumn(prop) { // 是否显示当前列
            if(this.staffTableSel2.findIndex(v => v == prop) > -1) {
                return true
            }
            return false
        },
        cancelBtn() { // 取消按钮
            this.selTableVisible=false;
            this.flag=true;
        },
    }
}

// 参数统一请求
export const commPara = {
    data() {
        return {

        }
    },
    created() {
        if(this.paraObj && Object.keys(this.paraObj).length && !this.notAuto) {
            this.initPara();
        }

        if(this.sysParaObj && Object.keys(this.sysParaObj).length && !this.notAuto) {
            this.initSysPara();
        }
    },
    methods: {
        initPara() { // 初始化页面参数  业务参数
            return new Promise((resolve, reject) => {
                let codes = Object.keys(this.paraObj).join();
                getParaListByCodes(codes).then(res => {
                    if(res.data.code == 1000) {
                        let data = res.data.data;
                        if(data) {
                            Object.keys(data).forEach(key => {
                                if(this.paraObj.hasOwnProperty(key)) {
                                    let list = Array.isArray(data[key]) ? data[key] : [];
                                    if(list.length) {
                                        list = list.map(item => {
                                            return {
                                                ...item,
                                                id: item.id,
                                                label: item.name,
                                                value: item.valStr
                                            }
                                        })
                                        this.paraObj[key] = [...list];
                                    }
                                }
                            })
                            resolve();
                        }else {
                            reject();
                        }
                    }
                })
            })
        },
        initSysPara() { // 初始化页面参数  系统参数
            return new Promise((resolve, reject) => {
                let codes = Object.keys(this.sysParaObj).join();
                getSysParaListByCodes(codes).then(res => {
                    if(res.data.code == 1000) {
                        let data = res.data.data;
                        if(data) {
                            Object.keys(data).forEach(key => {
                                if(this.sysParaObj.hasOwnProperty(key)) {
                                    let list = Array.isArray(data[key]) ? data[key] : [];
                                    if(list.length) {
                                        list = list.map(item => {
                                            return {
                                                ...item,
                                                id: item.id,
                                                label: item.name,
                                                value: item.valStr
                                            }
                                        })
                                        this.sysParaObj[key] = [...list];
                                    }
                                }
                            })
                            resolve();
                        }else {
                            reject();
                        }
                    }
                })
            })
        },
    },
}

// 权限控制 （界面元素/界面操作）
export const auth = {
    data() {
        return {}
    },
    computed: {
        ...mapState({
            authList: state => state.token.authList
        })
    },
    methods: {
        showAuth(code) {
            return this.authList.findIndex(item => item == code) > -1;
        }
    }
}
